<template>
    <div class="fillContain">
        <head-top></head-top>
        <el-form :inline="true" ref="form"  size="mini" label-width="">
            <el-form-item label="数据生成名称：">
                <el-input placeholder="请输入名称" v-model="name" style="width: 200px" clearable></el-input>
            </el-form-item>
            <el-form-item label="状态：">
                <el-select v-model="Statuss" clearable placeholder="请选择" style="width: 200px" >
                    <el-option v-for="item in options" :key="item.value" :label="item.label"
                               :value="item.value"></el-option>
                </el-select>
            </el-form-item>
            <el-button icon="el-icon-search" size="mini" type="primary" @click="search()">查询</el-button>
            <el-button  size="mini" type="primary" icon="el-icon-remove" @click="resetSearch()">重置</el-button>
            <el-button icon="el-icon-plus" size="mini" type="primary" @click="addData()">新增</el-button>
        </el-form>
        <el-table                         v-loading="loading"
                                          element-loading-text="SQL执行中...."
                                          element-loading-spinner="el-icon-loading"
                                          element-loading-background="rgba(0, 0, 0, 0.8)"
                :data="tableData" border style="width: 100%;margin-top: 30px" height="550px"
                  >
            <el-table-column prop="id" label="标识" width="100"></el-table-column>
            <el-table-column prop="name" label="数据生成名称" width="120"></el-table-column>
            <el-table-column prop="dsname" label="数据源" width="200"></el-table-column>
            <el-table-column prop="status" label="状态" width="120" :formatter="statusFormatter"></el-table-column>
            <el-table-column prop="createTime" label="创建时间"></el-table-column>
            <el-table-column prop="updateTime" label="修改时间"></el-table-column>
            <el-table-column label="操作" width="300">
                <template slot-scope="scope" >
                    <el-button size="mini" type="primary" icon="el-icon-edit" @click="editData(scope.row)">编辑</el-button>
                    <el-button size="mini" type="danger" icon="el-icon-circle-close" @click.native.prevent="deleteSubmitForm(scope.$index,scope.row)">删除</el-button>
                    <el-button size="mini" type="success" icon="el-icon-caret-right" @click="totalRun(scope.row)">批量执行</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="block">
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="currentPage"
                    :page-sizes="[5, 10, 15, 20]"
                    :page-size="pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="counts">
            </el-pagination>
        </div>
        <el-dialog title="报表数据生成"   :visible.sync="addDatacenterDialogVisible" width="70%" left ref="reportdata">
            <el-form :model="reportdata" :rules="rules" ref="reportdata" label-width="120px"  label-position="right">
                <el-form-item label="数据生成名称"  prop="name" >
                    <el-input type="text"  v-model="reportdata.name" auto-complete="off" style="width: 200px" clearable placeholder="请输入数据生成名称" class="widthinput"></el-input>
                </el-form-item>
                <el-form-item label="数据源"  prop="dsId">
                    <el-select v-model="reportdata.dsId" clearable placeholder="请选择数据源" style="width: 200px"  @change="selectDsid(reportdata.dsId)">
                        <el-option v-for="item in dataSource" :key="item.name" :label="item.name"
                                   :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="状态" prop="status">
                    <el-select v-model="reportdata.status" clearable placeholder="请选择数据源" style="width: 200px" >
                        <el-option v-for="item in options" :key="item.key" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="sql语句集" prop="sqls">
                    <span v-for="(sqls, index) in reportdata.sqls" :label=" + index" :key="sqls.key">
                        <el-form :inline="true" ref="form"  size="medium" label-position="left">
                            <el-form-item>
                                <el-input v-model="sqls.order" style="display: none"></el-input>
                            </el-form-item>
                            <el-form-item :label=" '序号:'+index" :prop="'sqls.' + index + '.value'" >
                                <el-input v-model="sqls.value" type="textarea"  clearable placeholder="请输入SQL语句" style="width: 300px;margin-bottom: 5px"></el-input>
                            </el-form-item>
                            <el-form-item  :prop="'sqls.' + index + '.dataSourceId'">
                                <el-select v-model="sqls.dataSourceId" clearable placeholder="请选择数据源" style="width: 100px"  >
                                    <el-option v-for="item in dataSource" :key="item.name" :label="item.name"
                                               :value="item.id"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-button @click.prevent="addsqls()" size="mini" type="primary" class="el-icon-plus"></el-button>
                            <el-button @click.prevent="removesqls(sqls)" size="mini" type="primary" class="el-icon-error"></el-button>
                        </el-form>
                    </span>
                </el-form-item>
                <el-form-item label="参数配置" prop="params">
                    <span v-for="(params, index) in reportdata.params" :label=" + index">
                        <el-form :inline="true" ref="form"  size="medium" label-position="left">
                            <el-form-item label="名称:" prop="key" >
                                <el-input v-model="params.key"  style="width: 120px"></el-input>
                            </el-form-item>
                            <el-form-item label="类型:" prop="type" >
                                 <el-select v-model="params.type" clearable placeholder="请选择" style="width: 100px"  @change="updateOptions2Value(params.type)">
                                    <el-option v-for="item in options2" :key="item.value" :label="item.label"
                                               :value="item.value"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="字典编码:" prop="dataCode" v-if="params.type==2" >
                                 <el-select v-model="params.dataCode" clearable placeholder="请选择" style="width: 100px"  filterable>
                                    <el-option v-for="item in sysDict" :key="item.dictCode" :label="item.dictName+'('+item.dictCode+')'"
                                               :value="item.dictCode"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="SQL编码:" prop="dataCode" v-if="params.type==3" >
                                 <el-select v-model="params.dataCode" clearable placeholder="请选择" style="width: 100px"  filterable>
                                    <el-option v-for="item in sysSQL" :key="item.sqlCode" :label="item.sqlName+'('+item.sqlCode+')'"
                                               :value="item.sqlCode"></el-option>
                                </el-select>
                            </el-form-item>

                            <el-form-item label="值:" prop="value" >
                                <el-input v-model="params.value" style="width: 70px"></el-input>
                            </el-form-item>
                            <el-button @click.prevent="addparms()" size="mini" type="primary" class="el-icon-plus"></el-button>
                            <el-button @click.prevent="removeparms(params)" size="mini" type="primary" class="el-icon-error"></el-button>
                        </el-form>
                    </span>
                </el-form-item>

                <el-form-item label-width="400px">
                    <el-button type="primary" @click="addSubmitForm('reportdata')" size="mini" >提交</el-button>
                    <el-button @click="addDatacenterDialogVisible = false" size="mini" type="primary">取消</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>



        <el-dialog title="报表数据修改"   :visible.sync="centerDialogVisible" width="70%" left ref="reportdata">
            <el-form :model="reportdata" :rules="rules" ref="reportdata" label-width="120px"  label-position="right">
                <el-form-item label="数据生成名称"  prop="name" >
                    <el-input type="text"  v-model="reportdata.name" auto-complete="off" style="width: 200px" clearable placeholder="请输入数据生成名称" class="widthinput"></el-input>
                </el-form-item>
                <el-form-item label="数据源"  prop="dsId">
                    <el-select v-model="reportdata.dsId" clearable placeholder="请选择数据源" style="width: 200px"  @change="selectDsid(reportdata.dsId)">
                        <el-option v-for="item in dataSource" :key="item.name" :label="item.name"
                                   :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="状态" prop="status">
                    <el-select v-model="reportdata.status" clearable placeholder="请选择数据源" style="width: 200px" >
                        <el-option v-for="item in options" :key="item.key" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="sql语句集" prop="sqls">
                    <span v-for="(sqls, index) in reportdata.sqls" :label=" + index" :key="sqls.key">
                        <el-form :inline="true" ref="form"  size="medium" label-position="left">
                            <el-form-item>
                                <el-input v-model="sqls.order" style="display: none"></el-input>
                            </el-form-item>
                            <el-form-item :label=" '序号:'+index" :prop="'sqls.' + index + '.value'" >
                                <el-input v-model="sqls.value" type="textarea"  clearable placeholder="请输入SQL语句" style="width: 300px;margin-bottom: 5px"></el-input>
                            </el-form-item>
                            <el-form-item  :prop="'sqls.' + index + '.dataSourceId'">
                                <el-select v-model="sqls.dataSourceId" clearable placeholder="请选择数据源" style="width: 100px"  >
                                    <el-option v-for="item in dataSource" :key="item.name" :label="item.name"
                                               :value="item.id"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-button @click.prevent="addsqls()" size="mini" type="primary" class="el-icon-plus"></el-button>
                            <el-button @click.prevent="removesqls(sqls)" size="mini" type="primary" class="el-icon-error"></el-button>
                        </el-form>
                    </span>
                </el-form-item>
                <el-form-item label="参数配置" prop="params">
                    <span v-for="(params, index) in reportdata.params" :label=" + index">
                        <el-form :inline="true" ref="form"  size="medium" label-position="left">
                            <el-form-item label="名称:" prop="key" >
                                <el-input v-model="params.key"  style="width: 120px"></el-input>
                            </el-form-item>
                            <el-form-item label="类型:" prop="type" >
                                 <el-select v-model="params.type" clearable placeholder="请选择" style="width: 100px"  @change="updateOptions2Value(params.type)">
                                    <el-option v-for="item in options2" :key="item.value" :label="item.label"
                                               :value="item.value"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="字典编码:" prop="dataCode" v-if="params.type==2" >
                                 <el-select v-model="params.dataCode" clearable placeholder="请选择" style="width: 100px"  filterable>
                                    <el-option v-for="item in sysDict" :key="item.dictCode" :label="item.dictName+'('+item.dictCode+')'"
                                               :value="item.dictCode"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="SQL编码:" prop="dataCode" v-if="params.type==3" >
                                 <el-select v-model="params.dataCode" clearable placeholder="请选择" style="width: 100px"  filterable>
                                    <el-option v-for="item in sysSQL" :key="item.sqlCode" :label="item.sqlName+'('+item.sqlCode+')'"
                                               :value="item.sqlCode"></el-option>
                                </el-select>
                            </el-form-item>

                            <el-form-item label="值:" prop="value" >
                                <el-input v-model="params.value" style="width: 70px"></el-input>
                            </el-form-item>
                            <el-button @click.prevent="addparms()" size="mini" type="primary" class="el-icon-plus"></el-button>
                            <el-button @click.prevent="removeparms(params)" size="mini" type="primary" class="el-icon-error"></el-button>
                        </el-form>
                    </span>
                </el-form-item>

                <el-form-item label-width="400px">
                    <el-button type="primary" @click="editSubmitForm('reportdata')" size="mini" >提交</el-button>
                    <el-button @click="centerDialogVisible = false" size="mini" type="primary">取消</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
<!--        <el-dialog title="报表数据修改"   :visible.sync="centerDialogVisible" width="70%" left ref="reportdata" @closed="cancel('reportdata')">
            <el-form :model="reportdata"  ref="reportdata" label-width="120px"  label-position="right">
                <el-form-item label="数据生成名称"  prop="name" :rules="{required: true, message: '名称不能为空', trigger: 'blur' }">
                    <el-input type="text"  v-model="reportdata.name" auto-complete="off" style="width: 200px" clearable placeholder="请输入数据生成名称" class="widthinput"></el-input>
                </el-form-item>
                <el-form-item label="数据源"  prop="dsId" :rules="{required: true, message: '数据源不能为空', trigger: 'blur' }" >
                    <el-select v-model="reportdata.dsId" clearable placeholder="请选择数据源" style="width: 200px"  @change="selectDsid(reportdata.dsId)">
                        <el-option v-for="item in dataSource" :key="item.name" :label="item.name"
                                   :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="状态" prop="status" :rules="{required: true, message: '状态不能为空', trigger: 'blur' }">
                    <el-select v-model="reportdata.status" clearable placeholder="请选择数据源" style="width: 200px" >
                        <el-option v-for="item in options" :key="item.key" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="sql语句集" prop="sqls" v-for="(sqls, index) in reportdata.sqls">
                    <el-form :inline="true" ref="form" size="medium" label-position="left">
                        <el-form-item>
                            <el-input v-model="sqls.order" style="display: none"></el-input>
                        </el-form-item>
                        <el-form-item :label=" '序号:'+index" :prop="'sqls.' + index + '.value'">
                            <el-input v-model="sqls.value" type="textarea"  clearable placeholder="请输入SQL语句" style="width: 200px;margin-bottom: 5px"></el-input>
                        </el-form-item>

                        <el-form-item  :prop="'sqls.' + index + '.dataSourceId'" >
                            <el-select v-model="sqls.dataSourceId" clearable placeholder="请选择数据源" style="width: 100px" >
                                <el-option v-for="item in dataSource" :key="item.name" :label="item.name"
                                           :value="item.id"></el-option>
                            </el-select>
                        </el-form-item>

                        <el-button @click.prevent="addsqls()" size="mini" type="primary" class="el-icon-plus"></el-button>
                        <el-button @click.prevent="removesqls(sqls)" size="mini" type="primary" class="el-icon-error"></el-button>
                    </el-form>
                </el-form-item>
                <el-form-item label="参数配置" prop="params" v-for="(params, index) in reportdata.params" >
                    <el-form :inline="true" ref="form"  size="medium" label-position="left">
                        <el-form-item label="key:" :prop="'params.' + index + '.key'">
                            <el-input v-model="params.key"  style="width: 120px" :value="index"></el-input>
                        </el-form-item>
                        <el-form-item label="type:" :prop="'params.' + index + '.type'" >
                            <el-select v-model="params.type" clearable placeholder="请选择" style="width: 100px" >
                                <el-option v-for="item in options2" :key="item.value" :label="item.label"
                                           :value="item.value"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="字典编码:" prop="dataCode" v-if="params.type==2" >
                            <el-select v-model="params.dataCode" clearable placeholder="请选择" style="width: 100px"  filterable>
                                <el-option v-for="item in sysDict" :key="item.dictCode" :label="item.dictName+'('+item.dictCode+')'"
                                           :value="item.dictCode"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="SQL编码:" prop="dataCode" v-if="params.type==3" >
                            <el-select v-model="params.dataCode" clearable placeholder="请选择" style="width: 100px"  filterable>
                                <el-option v-for="item in sysSQL" :key="item.sqlCode" :label="item.sqlName+'('+item.sqlCode+')'"
                                           :value="item.sqlCode"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="value:" :prop="'params.' + index + '.value'" >
                            <el-input v-model="params.value" style="width: 70px"></el-input>
                        </el-form-item>
                        <el-button @click.prevent="addparms()" size="mini" type="primary" class="el-icon-plus"></el-button>
                        <el-button @click.prevent="removeparms(params)" size="mini" type="primary" class="el-icon-error"></el-button>
                    </el-form>
                </el-form-item>

                <el-form-item label-width="400px">
                    <el-button type="primary" @click="editSubmitForm('reportdata')" size="mini" >提交</el-button>
                    <el-button @click="cancel('reportdata')" size="mini" type="primary">取消</el-button>
                </el-form-item>
            </el-form>

        </el-dialog>-->


    </div>
    
</template>

<script>
    import {getDataSourceList} from '@/api/getData'
    import {getDictByCodeAndValue,sysDictListNoPage} from "@/api/dictCodeManager"
    import {addReportData,getTableData,deleteTableData,editTableData,ListSysDictAndSQL,ListSysDict,totalRun} from '@/api/reportData'
    import HeadTop from '@/views/main-components/HeadTop.vue'
    export default {
        components: {
            HeadTop,
        },
        data(){
            return{
                loading: false,
                options: [{value: '00A', label: '启用'},{value: '00X', label: '禁用'}],//数据源状态配置
                dataSource:[],//数据源列表
                datashu:'',//中间值，为了改变第一数据源从而改变其他数据源而设置的
                options2: [{value: '1', label: '直接取值'},{value: '2', label: '字典配置'},{value: '3', label: 'sql配置'}],//参数配置类型
                tableData:[],//table数据
                sysDict:[],//字典表数据
                sysSQL:[],//syssql表数据
                reportdata:{
                    id:'',
                    name:'',
                    dsId:'',
                    status:'',
                    sqls:[{
                        order:"",
                        value:'',
                        dataSourceId:''
                    }],
                    params:[{
                        key:'',
                        value:'',
                        dataCode:'',
                        type:''
                    }],
                },
                rules: {
                    name: [{required: true, message: '请输入数据生成名称', trigger: 'blur'}],
                    dsId: [{required: true, message: '数据源不能为空', trigger: 'blur'}],
                    status: [{required: true, message: '请选择状态', trigger: 'blur'}]
                },
                name:'',
                Statuss:'',
                counts: 0,
                currentPage: 1,
                pageSize: 5,
                centerDialogVisible: false,
                addDatacenterDialogVisible: false,
                myMap :new Map(),
            }
        },

        created(){
            this.getUserInfo();
        },
        methods:{

            /**
             *测试用户权限
             */
            async getUserInfo(){
                console.log(this.$route.query.userId);
                let STAFF_ID=this.$utils.getUrlKey("STAFF_ID");
                let OPERATE_TIME=this.$utils.getUrlKey("OPERATE_TIME");
                let TRADE_ID=this.$utils.getUrlKey("TRADE_ID");
                let SIGNMSG=this.$utils.getUrlKey("SIGNMSG");
                let channel='ReprotData';
                if (STAFF_ID==1){
                    this.search();
                    this.updateOptions2Value();
                    this.getDictByCodeAndVal();
                } else {
                    let userinfo= await this.getUser(STAFF_ID,OPERATE_TIME,TRADE_ID,SIGNMSG,channel);
                    if (userinfo.isPression){
                        this.search();
                        this.updateOptions2Value();
                        this.getDictByCodeAndVal();
                    }else{
                        this.$router.push({path: '/404',query:{ msg:userinfo.msg}});
                    }
                }

            },

            //监听页面变化
            handleSizeChange(val) {
                this.pageSize = val;
                this.search();
            },
            //监听页面选择变化
            handleCurrentChange(val) {
                this.currentPage = val;
                this.search();
            },
            //重置查询条件
            resetSearch() {
                this.name = '';
                this.Statuss = '';
            },
            //table字段转换
            statusFormatter: function(row, column) {

               return this.myMap.get(row.status)
                //return row.status == "00A" ? "启用" : row.status == "00X" ? "禁用" : "未知";
            },
            /**
             * 第一数据源改变时，其他数据源默认改变
             */
            selectDsid(value){
                //let sqlsss=this.reportdata.sqls;
                for(let index  in this.reportdata.sqls){
                    this.reportdata.sqls[index].dataSourceId=value;
                }
                this.datashu=value;
            },
            /**
             * 参数配置的值发生变化
             */
            async updateOptions2Value(value){
                    this.sysDict=[];
                    this.sysSQL=[];
                    let list =await ListSysDictAndSQL();
                    this.sysDict=list.sysdicts;
                    this.sysSQL=list.syssqls;
            },
            /**
             * 编辑  取消 这个会造成显示BUG注释掉
             */
/*            cancel(forName){
                this.centerDialogVisible = false;
                this.$refs[forName].resetFields();
            },*/
            /**
             *点击添加按钮，弹出弹窗
             */
            addData(reportdata) {
                this.reportdata={ id:'', name:'', dsId:'', status:'', sqls:[{ order:'', value:'',dataSourceId:'' }], params:[{ key:'', value:'', type:'' }], };
                this.addDatacenterDialogVisible = true;
                this.getList();
            },
            /**
             *点击编辑按钮，弹出弹窗
             */
            editData(reportdata) {
                this.getList();
                this.centerDialogVisible = true;
                if (typeof reportdata.sqls === 'string') {
                    reportdata.sqls=JSON.parse( reportdata.sqls );
                    reportdata.params=JSON.parse( reportdata.params );
                }
                for(let index  in reportdata.sqls){
                    reportdata.sqls[index].dataSourceId=parseInt(reportdata.sqls[index].dataSourceId);
                }
                this.reportdata=reportdata;
            },
            async totalRun(row) {
                this.loading = true;
                let reply = await totalRun(row.id);
                if (reply.code == 500) {
                    this.loading = false;
                    this.$notify.error({
                        title: '错误',
                        message: reply.msg
                    });
                }else {
                    this.loading = false;
                    this.$notify.success({
                        title: '成功',
                        message: '操作成功'
                    })
                }
            },

            /**
             * 点击删除，删除一行sql
             * @param item
             */
            removesqls(item) {
                var index = this.reportdata.sqls.indexOf(item)
                if (this.reportdata.sqls.length>1) {
                    this.reportdata.sqls.splice(index, 1);
                    return;
                }
                if(this.reportdata.sqls.length<=1){
                    this.$notify.error({
                        title: '',
                        message: '不允许删除'
                    });
                }
            },
            /**
             * 点击新增，新增一行sql
             */
            addsqls() {
                this.reportdata.sqls.push({
                    order:'',
                    value: '',
                    dataSourceId:this.datashu
                });
            },
            /**
             * 点击删除，删除一行参数
             * @param item
             */
            removeparms(item) {
                var index = this.reportdata.params.indexOf(item)
                if (this.reportdata.params.length>1) {
                    this.reportdata.params.splice(index, 1);
                    return;
                }
                if(this.reportdata.params.length<=1){
                    this.$notify.error({
                        title: '',
                        message: '不允许删除'
                    });
                }

            },
            /**
             * 点击新增，新增一行参数
             */
            addparms() {
                this.reportdata.params.push({
                    key: '',
                    value: ''
                });
            },

            /**
             * 获取字典信息
             */
            async getDictByCodeAndVal(){
                var params2 = {
                    type:'dict',
                    dictCode: "REPORT_STATUS"
                };
                var params3 = {
                    type:'sql',
                    dictCode: "ACCSCALE_CHANNELNAME"
                };
                let dictSQL =await ListSysDict(params2);
                dictSQL.forEach(dict=>{
                    this.myMap.set(dict.VALUE,dict.NAME);
                })
            },

            /**
             * 获取数据源列表
             */
            async  getList() {
                let reply =await getDataSourceList();
                this.dataSource = reply;
            },
            /**
             *查询方法
             */
            async  search(){
                const loading = this.$loading({
                    lock: true,
                    text: '加载中...',
                    spinner: 'el-icon-loading',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                var params = {
                    size: this.pageSize,
                    current: this.currentPage,
                    name: this.name,
                    status: this.Statuss
                }
                let reply = await getTableData(params);
                loading.close();
                if (reply.code == 500) {
                    this.$notify.error({
                        title: '错误',
                        message: reply.msg
                    });
                } else {
                    this.counts = reply.data.total;
                    this.currentPage = reply.data.pageNum;
                    this.tableData = reply.data.list;
                }
            },
            /**
             * 新增数据，提交
             * @param formName
             */
            addSubmitForm(formName) {
                var mapArr= this.reportdata.params.map(item=>item.key);
                var setArr = new Set(mapArr);//去重复
                if(setArr .size<mapArr.length){
                    this.$notify.error({
                        title: '',
                        message: '参数名称不可重复！'
                    });
                    return false;
                }
                for(let index  in this.reportdata.sqls){
                    this.reportdata.sqls[index].order=index;
                }
                for(let index  in this.reportdata.sqls){
                    if(this.reportdata.sqls[index].value==''||this.reportdata.sqls[index].dataSourceId==''){
                        this.$notify.error({
                            title: '',
                            message: 'sql语句集不可为空！'
                        });
                        return false;
                    }

                }
/*                this.reportdata.sqls=JSON.stringify(this.reportdata.sqls);
                this.reportdata.params=JSON.stringify(this.reportdata.params);*/
                const loading = this.$loading({
                    lock: true,
                    text: '加载中...',
                    spinner: 'el-icon-loading',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                const set = this.$refs;
                set[formName].validate( async(valid) => {
                    if (valid) {
                        var  reportdata={
                            id:this.reportdata.id,
                            name:this.reportdata.name,
                            dsId:this.reportdata.dsId,
                            status:this.reportdata.status,
                            sqls:JSON.stringify(this.reportdata.sqls),
                            params:JSON.stringify(this.reportdata.params),
                        };

                      let reply =await addReportData(this.reportdata);
                        loading.close();
                        if (reply.code == 200) {
                            this.$notify.success({
                                title: '',
                                message: '新增成功！'
                            });

                            this.addDatacenterDialogVisible = false;
                        } else {
                            this.$notify.error({
                                title: '',
                                message: reply.msg
                            });
                        }

                    } else {
                        return false;
                    }
                    //this.$refs[forName].resetFields();
                });
                this.search();


            },


            /**
             * 提交数据到后台
             * @param formName
             */
            editSubmitForm(formName) {
                var mapArr= this.reportdata.params.map(item=>item.key);
                var setArr = new Set(mapArr);//去重复
                if(setArr .size<mapArr.length){
                    this.$notify.error({
                        title: '',
                        message: '参数名称不可重复！'
                    });
                    return false;
                }
                for(let index  in this.reportdata.sqls){
                    this.reportdata.sqls[index].order=index;
                }
                for(let index  in this.reportdata.sqls){
                    if(this.reportdata.sqls[index].value=='' ||this.reportdata.sqls[index].dataSourceId==''){
                        this.$notify.error({
                            title: '',
                            message: 'sql语句集不可为空！'
                        });
                        return false;
                    }

                }

/*                this.reportdata.sqls=JSON.stringify(this.reportdata.sqls);
                this.reportdata.params=JSON.stringify(this.reportdata.params);*/
                const loading = this.$loading({
                    lock: true,
                    text: '加载中...',
                    spinner: 'el-icon-loading',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                const set = this.$refs;
                set[formName].validate(async(valid) => {
                    if (valid) {
                        let reply =await editTableData(this.reportdata);

                        if (reply.code == 200) {
                            this.$notify.success({
                                title: '',
                                message: '编辑成功！'
                            });
                            this.centerDialogVisible = false;
                            loading.close();
                        } else {
                            this.$notify.error({
                                title: '',
                                message: '编辑失败！'
                            });
                            loading.close();
                        }

                    } else {
                        loading.close();
                        return false;
                    }
                });
               this.search();

            },



            /**
             * 删除当前数据源
             * @param formName
             */
            async  deleteSubmitForm(index,tableData){
                const loading = this.$loading({
                    lock: true,
                    text: '加载中...',
                    spinner: 'el-icon-loading',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                let reply =await deleteTableData(tableData);
                if (reply.code == 200) {
                    this.tableData.splice(index, 1);
                    loading.close();
                    this.$notify.success({
                        title: '',
                        message: '删除成功！'
                    });
                } else {
                    loading.close();
                    this.$notify.error({
                        title: '',
                        message: reply.msg
                    });
                }
            }
        }
    }
</script>

<style scoped>

    .widthinput{
        width: 82%;
    }

</style>